<template lang="pug">
view.a-checkbox
  label.flex.start(@click="methods._change")
    aimg(:src="`${modelValue?'':'un'}check${round?'2':''}`" svg)
    view.grow.m-l-15: slot
</template>
<script setup>
const emits = defineEmits(['update:modelValue'])
const props = defineProps({
  round: {type: Boolean, default: false},
  modelValue: {type: Boolean, default: false},
  size: {type: [Number, String], default: 18}, // 单位px
})

const methods = {
  _change(){
    emits('update:modelValue', !props.modelValue)
  }
}

</script>
<style lang="scss" scoped>
@use '/common/scss/mixin.scss' as *;
.a-checkbox{
  --aimg-width: calc( v-bind("size") * 1px);
}
</style>